<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Students</title>
    </head>
    <body>
        <h1>
            <a href="/students">Grade Book</a> - {{.Name}}
        </h1>

        {{if gt (len .Grades) 0}}
        <table>
            <tr>
                <th>Title</th>
                <th>Type</th>
                <th>Score</th>
            </tr>
            {{range .Grades}}
            <tr>
                <td>{{.Title}}</td>
                <td>{{.Type}}</td>
                <td>{{.Score}}</td>
            </tr>
            {{end}}
        </table>
        {{else}}
        <em>No grades available.</em>
        {{end}}

        <fieldset>
            <legend>Add a grade</legend>
            <form action="/students/{{.ID}}/grades" method="POST">
                <table>
                    <tr>
                        <td>Title</td>
                        <td>
                            <input type="text" name="Title" />
                        </td>
                    </tr>
                    <tr>
                        <td>Type</td>
                        <td>
                            <select name="Type" id="Type">
                                <option value="Test">Test</option>
                                <option value="Quiz">Quiz</option>
                                <option value="Exam">Exam</option>
                            </select>
                        </td>
                    </tr>
                    <tr>
                        <td>Score</td>
                        <td>
                            <input type="number" min="0" max="100" step="1" name="Score" />
                        </td>
                    </tr>
                </table>
                <button type="submit">Submit</button>
            </form>
        </fieldset>
    </body>
</html>
